<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";
long port=request.getServerPort();
if(port==80){
	basePath = request.getScheme()+"://"+request.getServerName()+path+"/";
}
%>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
	<meta name="renderer" content="webkit" />
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
	<meta http-equiv="pragma" content="no-cache" />
	<meta http-equiv="cache-control" content="no-cache" />
	<meta http-equiv="expires" content="0" />
	<meta http-equiv="keywords" content="云净库存管理登录" />
	<meta http-equiv="description" content="云净是一个多层次、体系化、可交互的肾脏慢病管理服务平台，所涉及的专业领域是肾脏慢性疾病管理，包括尿毒症及其各种原发性疾病。其院内核心医疗业务信息化管理平台有血透、腹透及肾科病案管理，围绕患者从院前干预、院中诊治到院后追踪实现一体化管理及延伸服务；通过众多跨平台端口（桌面PC端、移动平板、WEB管理平台、专业论坛、手机APP、微信公众号等）实现信息共享、互联互通。" />
	<title>云净药房管理登录</title>
	<link rel = "stylesheet" type="text/css" href = "../kuncun/assets/login_icon/iconfont.css" />
	<link href="../image/logo.ico" type="image/x-icon" rel="shortcut icon">
	
	<style>
    * {
      margin: 0;
      padding: 0;
      font-family:"microsoft yahei";
    }

    #logo_container {
      height: 400px;
      background-color: #263954;
      background: linear-gradient(#274067,#263954);
      text-align: center;
      line-height: 400px;
      vertical-align: middle;
      font-family:"microsoft yahei";
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .container {
      width: 352px;
      margin: 80px auto;
    }

    .form-group {
      margin-bottom: 30px;
      position: relative;
      width: 350px;
      margin-right: auto;
      margin-left: auto;
      border: 1px solid #818181;
      height: 50px;
      font-size: 20px;
      line-height: 50px;
      overflow: hidden;
    }

    input[type=text],
    input[type=password] {
      height: 50px;
      width: 290px;
      outline: none;
      border: none;
      font-size: 22px;
      margin-left: 60px;
      background: #fff !important;
      position: absolute;
      top: 0;
      left: 0;
    }

    #login_btn {
      margin-top: 20px;
      position: relative;
      width: 350px;
      text-align:center;
      vertical-align:middle ;
      border: 0px solid #818181;
      cursor: pointer;
      height: 50px;
      line-height:50px;
      letter-spacing:16px;
      background-color: #273D5F;
      border-radius: 3px;
      font-size: 24px;
      color: #fff;
    }

    input:-webkit-autofill,
    textarea:-webkit-autofill,
    select:-webkit-autofill {
      -webkit-box-shadow: 0 0 0 1000px white inset;
    }

    input[type=text]:focus,
    input[type=password]:focus,
    textarea:focus {
      -webkit-box-shadow: 0 0 0 1000px white inset;
    }
    #login_btn:hover{
    	opacity:.9;
    }
    #loginLogo{
    	width:88px;height:90px;margin-right:22px;
    }
    #loginTitle{
    	font-size:60px;color:#fff;letter-spacing:8px;
    }
    @media only screen and (max-width: 768px) {
	    #loginLogo{
	    	width:46px;height:48px;margin-right:22px;
	    }
	    #loginTitle{
	    	font-size:42px;letter-spacing:1px;
	    }
	    #logo_container {
	      height: 200px;
	      background-color: #263954;
	      background: linear-gradient(#274067,#263954);
	      text-align: center;
	      line-height: 200px;
	      vertical-align: middle;
	      font-family:"microsoft yahei";
	      display: flex;
	      justify-content: center;
	      align-items: center;
	    }
	   .container{
	   	  margin-top:26px;
	   }
	}
  </style>
</head>
<body>
	<div id="logo_container">
        <!-- <img src="image/logo.png" alt="" style="width:90px;height:90px;margin-right:26px;"> -->
        <img src="./image/logo.svg" alt="云净"  id="loginLogo">
        <span  id="loginTitle">云净药房管理系统</span>
	</div>
    <div class="container" id="app">
        <form>
	        <div class="form-group">
	            <label for="loginName"></label>
	             <i class="iconfont" style="font-weight:500;font-size:30px;position:absolute;width:60px;display:inline-block;text-align:center;">&#xe710;</i>&nbsp;
	            <input type="text" name="name" class="form-control" id="loginName" placeholder="请输入用户名">
	        </div>
	        <div class="form-group">
	            <label for="loginPwd"></label>
	            <i class="iconfont" style="font-weight:500;font-size:30px;position:absolute;width:60px;display:inline-block;text-align:center;">&#xe501;</i>&nbsp;
	            <input type="password" name="pwd" class="form-control" id="loginPwd" placeholder="请输入密码">
	        </div>
	        <div class="checkbox">
	            <label>
	                <input type="checkbox">&nbsp; 自动登录
	            </label>
	        </div>
	        <button type="submit" class="btn btn-default" id="login_btn">登录</button>
    	</form>
    </div>
    
</body>
	<script type="text/javascript" src="./js/lib/jquery-2.1.4.js" ></script>
	<script>
		if('${user.user_id}'!=''){
			window.location.href="<%=basePath%>yfgl/index.shtml";
		}
		
		$("#loginName,#loginPwd").on( "keyup", function ( evt ) {
	        var et = evt || window.event;
	        inputFocus( et );
	     });
	     
	    var $user = $("#loginName");
	    var $password = $("#loginPwd");
	    
		function inputFocus ( et ) {
		  var keyCode = et.keyCode;
		
		  if ( keyCode == 13 )
		  {
		    if ( $user.val() == '' )
		    {
		      $user.get( 0 ).focus();
		    }
		    else if ( $password.val() == '' )
		    {
		      $password.get( 0 ).focus();
		    }
		    else
		    {
		      $("form").submit();
		    }
		  }
		}
	    
		$("form").on("submit",function(){
			var loginName= $("#loginName").val();
			var loginPwd=$("#loginPwd").val();
			if(loginName=="" || loginPwd==""){
			alert("请填写用户名或密码!");
			return;
			}
		    var formData=$(this).serialize();
		    $.ajax({
		        url:"<%=basePath%>base/ajaxlogin.shtml",
		        type:"post",
		        data:formData,
		        success:function(data){
		        	if(data.status==0){
		        		window.location.reload();
		        	}else{
		        		alert("用户名或密码错误");
		        	}
		        }
		    });
		    return false;//阻止自动提交表单
		})
		
		var asyQuery = function(conf) {
				    return $.ajax({
				      url: conf.url,
				      type: conf.type || 'GET',
				      data: conf.data || {},
				      dataType: 'json',
				      success: function(dt) {
				        if (typeof conf.success === "function") {
				          conf.success(dt);
				        }
				      }
				    });
				  };
	</script>
</html>